<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@page import="com.asiainfo.bean.UserSessionBean"%>
<%@page import="com.asiainfo.util.SessionInfoUtil"%>
<%
    String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
	
	
    UserSessionBean userSessBean = SessionInfoUtil.getUserSessBean(request.getSession());
    if(userSessBean == null){
		String str = "<script>"
				 +"window.location.href='"+path+"/loginController/loginPhone.do'"
		           + "</script>";
		response.getWriter().write(str);
		return;
	}else{ 
		request.setAttribute("userSessBean", userSessBean);
	}
 

%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<title>模拟手机消费平台</title>
<link href="<%=path%>/view/css/bootstrap.css" rel="stylesheet" type="text/css" />
<link href="<%=path%>/view/css/bootstrap.min.css" rel="stylesheet" type="text/css" />

<script type="text/javascript">

</script>
<style>
.title{
	width:100%;
	position:absolute;
	top:0;
	background-color:#3cc;
	text-align:center;
	font-family:"Times New Roman", Times, serif;
}
.container{
	margin-top:60px;
}

</style>
</head>
<body>
<div class="title">
	<h3>模拟手机消费平台</h3>
</div>
<div class="container">
	<div class="col-sm-6 col-sm-offset-3">
		<div class="panel panel-success">
			<div class="panel-heading">
				<div class="row">
					<h4 class="col-sm-10 col-sm-offset-1 col-xs-12" style="text-align:center">手机模拟消费</h4>
				</div>
			</div>
			<div class="panel-body">
				<div  class="row">
					<div class="col-sm-2 col-sm-offset-1 col-xs-4" style="text-align:right">手机号：</div>
					<div class="col-sm-6 col-xs-5" style="text-align:left"><span><%=userSessBean.getPhone()%></span></div>
					<button class="btn  col-sm-2 col-xs-2" style="padding:0 " id="loginout">退出</button>
				</div>
				<div  class="row" style="margin-top:10px;">
					<div class="col-sm-2 col-sm-offset-1 col-xs-4" style="text-align:right">运营商：</div>
					<div class="col-sm-6 col-xs-5" style="text-align:left"><span><%=userSessBean.getOperatorName()%></span></div>
				</div>
				<!-- <form id="" class="col-sm-12 col-xs-12" role="form"> -->
					<div id="" class="form-group">
						<div class="row" style="margin-top:20px;">
							<div class="col-sm-3 col-xs-4 form-label" style="text-align:center;padding-right:0;padding-left:0;">
								<label class="control-label" for="time">通话时长:</label>
							</div>
							<div class="col-sm-2 col-xs-4" style="padding-left:5px;">
								<input id="voice" class="form-control" type="text" name="voice" style="height:25px;"/>
							</div>
							<button id="voiceUse" class="btn btn-primary col-sm-2 col-sm-offset-1 col-xs-3 col-xs-offset-1" style="height:25px;padding:0;"  >使用</button>
						</div>
						<div class="row" style="margin-top:10px;">
							<div class="col-sm-3 col-xs-4 form-label" style="text-align:center;padding-right:0;padding-left:0;">
								<label class="control-label" for="flow">流&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;量:</label>
							</div>
							<div class="col-sm-2 col-xs-4" style="padding-left:5px;">
								<input id="data" class="form-control" type="text" name="data" style="height:25px;"/>
							</div>
							<button  id="dataUse"  class="btn btn-primary col-sm-2 col-sm-offset-1 col-xs-3 col-xs-offset-1" style="height:25px;padding:0;">使用</button>
						</div>
						<div class="row" style="margin-top:10px;">
							<div class="col-sm-3 col-xs-4 form-label" style="text-align:center;padding-right:0;padding-left:0;">
								<label class="control-label" for="message">短&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;信:</label>
							</div>
							<div class="col-sm-2 col-xs-4" style="padding-left:5px;">
								<input id="message" class="form-control" type="text" name="message" style="height:25px;"/>
							</div>
							<button  id="messageUse" class="btn btn-primary col-sm-2 col-sm-offset-1 col-xs-3 col-xs-offset-1" style="height:25px;padding:0;">使用</button>
						</div>
					</div>
				<!-- </form> -->
				
			</div>
		</div>
	</div>
</div>	

<script type="text/javascript" src="<%=path%>/view/js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="<%=path%>/view/js/jquery.js"></script>
<script type="text/javascript" src="<%=path%>/view/js/bootstrap.js"></script>
<script type="text/javascript" src="<%=path%>/view/js/bootstrap.min.js"></script>


<script type="text/javascript">
//退出
$(function(){  
        $("#loginout").click(function(){  
        	
       	var actionUrl= "<%=path%>/loginController/logout.do";
       	 
           $.ajax({  
               url:actionUrl,  
               type:"post",  
               dataType : "JSON",
			    cache:false,
			  
               success:function(data){  
               
               	window.location.href = "<%=path%>/loginController/loginPhone.do";	 
               }, 
           error: function(req) {
				alert("退出失败");
			}
           });  
            
       });    
      });  
   

//通话
$(function(){  
    $("#voiceUse").click(function(){  
    	
    	var voice = $.trim($("#voice").val());
    	var phone = <%=userSessBean.getPhone()%>
      	var actionUrl= "<%=path%>/phoneController/callUse.do";
      	if(!checkCallInfo()){
			return;
		}
       $.ajax({  
           url:actionUrl,  
           type:"post",  
           data:JSON.stringify({phone:phone,
        	 call_use:voice,
        	 add_call:voice}), 
           dataType : "JSON",
		    cache:false,
		    contentType:"application/json",
           success:function(data){  
        	   if(data.flag == true){
           	alert("通话使用成功!");
        	   }else if(data.isNotOne == true){
        		   alert("所选套餐不止一个，使用失败!");
        	   }else if(data.isNotBalance == true){
        		   alert("余额不足，请充值!");
        	   }
        	    else{
        		   alert("使用失败");
        	   } 
           }, 
      error: function(req) {
			alert("使用失败");
		} 
       });  
     });    
  });      
     


//流量
$(function(){  
    $("#dataUse").click(function(){  
    	
    	var data = $.trim($("#data").val());
    	var phone = <%=userSessBean.getPhone()%>
      	var actionUrl= "<%=path%>/phoneController/dataUse.do";
      	
      	if(!checkDataInfo()){
			return;
		}
       $.ajax({  
           url:actionUrl,  
           type:"post",  
           data:JSON.stringify({phone:phone,
        	   data_use:data,
        	 add_data:data}), 
           dataType : "JSON",
		    cache:false,
		    contentType:"application/json",
           success:function(data){  
        	   if(data.flag == true){
           	alert("流量使用成功!");
        	   }else if(data.isNotOne == true){
        		   alert("所选套餐不止一个，使用失败!");
        	   }else if(data.isNotBalance == true){
        		   alert("余额不足，请充值!");
        	   }
        	   else{
        		   alert("使用失败1");
        	   }
           }, 
       error: function(req) {
			alert("使用失败2");
		}
       });  
     });    
  });   
  
  
  
//短信
$(function(){  
    $("#messageUse").click(function(){  
    	
    	var message = $.trim($("#message").val());
    	var phone = <%=userSessBean.getPhone()%>
      	var actionUrl= "<%=path%>/phoneController/messageUse.do";
   	 
      	if(!checkMessageInfo()){
			return;
		}
       $.ajax({  
           url:actionUrl,  
           type:"post",  
           data:JSON.stringify({phone:phone,
        	  message_use:message,
        	 add_message:message}), 
           dataType : "JSON",
		    cache:false,
		    contentType:"application/json",
           success:function(data){  
        	   if(data.flag == true){
           	alert("短信使用成功!");
        	   }else if(data.isNotOne == true){
        		   alert("所选套餐不止一个，使用失败!");
        	   }else if(data.isNotBalance == true){
        		   alert("余额不足，请充值!");
        	   }
        	   else{
        		   alert("使用失败");
        	   }
           }, 
       error: function(req) {
			alert("使用失败");
		}
       });  
        
   });    
  });   
  
  
//基本信息校验
function checkDataInfo(){
	
	var data = $.trim($("#data").val());
	
    if(data == ""){
      alert("流量不能为空！");
		return false;
	}
    if (/[^0-9]/g.test(data)) { 
    	alert("只能输入正整数！");
    	return false;
    }
	return true;	
}

function checkMessageInfo(){
	
	var message = $.trim($("#message").val());
	
    if(message == ""){
      alert("短信不能为空！");
		return false;
	}
    if (/[^0-9]/g.test(message)) { 
    	alert("只能输入正整数！");
    	return false;
    }
	return true;	
}

function checkCallInfo(){
	
	var voice = $.trim($("#voice").val());
	
    if(voice == ""){
      alert("通话时长不能为空！");
		return false;
	}
    if (/[^0-9]/g.test(voice)) { 
    	alert("只能输入正整数！");
    	return false;
    }
	return true;	
}
</script>

<!-- 以下两个插件用于在IE8以及以下版本浏览器支持HTML5元素和媒体查询，如果不需要用可以移除 -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</body>
</html>
